<template>
	<view>
		<view class="wubaoFutureLearningSociety" @click="about">
			<divimg class="bg" src="/static/images/index/wubaoFutureLearningSociety.png" mode="aspectFill"></divimg>
			<view class="text">
				<view class="title">雾宝未来学社</view>
				<view class="subtitle">平台介绍</view>
			</view>
		</view>
		<view class="grid spaceAround">
			<view class="item" @click="rmq">
				<image class="bg" src="/static/images/index/gridNetworkCircle.png" mode=""></image>
				<navigator url="/pages/group/group" open-type="switchTab" class="text" >
					<view class="title">人脉圈</view>
					<view class="subtitle">寻商机/ 找对人/谈合作/更高效</view>
				</navigator>
			</view>
			<view class="item innovate" @click="service" >
				<image class="bg" src="/static/images/index/innovate.png" mode=""></image>
				<view class="text">
					<view class="title">创新企业家社群</view>
					<view class="subtitle">与3000+创新企业家顶层人脉社交</view>
				</view>
			</view>
		</view>
		<service ref="service"></service>
	</view>
</template>

<script>
	import service from '@/components/service/service.vue';
	export default {
		name: 'laziness',
		components: {
			service,
		},
		data() {
			return {};
		},
		methods: {
			about(){
				uni.navigateTo({
					url:"/pages/my/about/about"
				})
			},
			rmq(){
				uni.navigateTo({
					url:"/pages/group/group"
				})
			},
			service() {
				this.$refs.service.open()
			},
		},
	};
</script>

<style lang="scss">
	.wubaoFutureLearningSociety {
		position: relative;
		width: 690rpx;
		height: 170rpx;
		margin: 20rpx auto;

		.text {
			font-weight: bold;
			color: #ffffff;
			font-size: $uni-font-size-14;
			position: absolute;
			z-index: 2;
			height: 100%;
			display: flex;
			flex-direction: column;
			justify-content: space-evenly;
			left: 45rpx;
		}
	}
	.grid {
		width: $connet-width;
		margin: 0 auto;

		.item {
			position: relative;
			width: 330rpx;
			height: 170rpx;

			.text {
				position: absolute;
				bottom: 0;
				left: 25rpx;
				z-index: 2;
				color: #ffffff;

				.title {
					font-size: $uni-font-size-14;
					font-weight: bold;
					margin-bottom: 13rpx;
				}

				.subtitle {
					font-size: $uni-font-size-10;
					margin-bottom: 15rpx;
				}
			}
		}
	}
</style>
